<template>
    <div class="home">

        <div class="baidumap" id="allmap">
        </div>

    </div>
</template>

<script>
    import { mapState, mapActions } from 'vuex'
    // import BMap from 'BMap'
    // import BMapSymbolSHAPEPOINT from 'BMap_Symbol_SHAPE_POINT'

    import { Icon } from 'vant'

    export default {
        // 当前组件的名称
        name: 'home',

        data() {
            return {

            }
        },

        // 在当前组件中添加其他的自定义组件
        components: {

        },

        /*
            在computed中添加mapState
            如果computed中只有一个辅助函数，后面可以直接写成函数名
        */
        computed: mapState(['token', 'userInfo']), // this.token相当于this.$store.state.token

        methods: {
            // baiduMap() {

            //     var map = new BMap.Map('allmap')
            //     map.addControl(new BMap.NavigationControl());
            //     var point = new BMap.Point(114.912999, 30.476580)
            //     map.centerAndZoom(point, 12)
            //     var marker = new BMap.Marker(point) // 创建标注
            //     map.addOverlay(marker)    // 将标注添加到地图中
            // },
            baiduMap() {
                var map = new BMap.Map("allmap");
                var point = new BMap.Point(114.912999, 30.476580);
                map.centerAndZoom(point, 12);

                var geolocation = new BMap.Geolocation();
                geolocation.getCurrentPosition(function (r) {
                    if (this.getStatus() == BMAP_STATUS_SUCCESS) {
                        var mk = new BMap.Marker(r.point);
                        console.log(666,mk)
                        map.addOverlay(mk);
                        map.panTo(r.point);
                        // alert('您的位置：' + r.point.lng + ',' + r.point.lat);
                    }
                    else {
                        // alert('failed' + this.getStatus());
                        var marker = new BMap.Marker(point) // 创建标注
                        map.addOverlay(marker)
                    }
                });
            }
        },
        // 生命周期函数,创建实例,可以获取this,但DOM节点还没有创建出来
        created() {
            console.log('created', this.$el)
        },
        // 生命周期函数,当前组件上的所有DOM节点都已经创建出来
        mounted() {
            this.baiduMap()
        },



    }


</script>

<!-- 添加scoped属性,将样式的作用域限制在当前组件内,不会影响子组件 -->
<style lang="scss" scoped>
    #allmap {
        width: 100vw;
        height: 100vh;
    }
</style>